import { SchemaManage } from '@/components/SchemaComponent';
import React, { useEffect, useState } from 'react';
import { connect } from 'umi';
import { ContacterAPI } from '../common/type';
import { getTableColumns } from '../mconfig';
import { contacterManageService, deleteContacterService } from '../services';
import { PlusOutlined } from '@ant-design/icons';
import { UpdateModal } from './UpdateModal';
import { message } from 'antd';
import { DetailDrawerView } from './DetailDrawerView';

// const mockDataList: Record<string, any>[] = [
//   {
//     page: 0,
//     rows: 0,
//     sort: null,
//     order: null,
//     dicTypeIds: null,
//     orderNum: null,
//     orderType: null,
//     orderTypeName: null,
//     errorMessage: null,
//     paramObject: null,
//     currentUserID: null,
//     versionFlag: true,
//     tenantID: null,
//     tenantName: null,
//     id: '8358732881207578624',
//     supplierID: '8358379213307867137',
//     supplierName: '中国科盛科技智能有限公司',
//     fullName: '田征',
//     phoneNum: null,
//     phoneMobile: '17596912111',
//     phoneOffice: '15151515',
//     phoneSpare: '18348569874',
//     isFirst: 1,
//     provinceCode: '130000',
//     provinceCodeName: '130000',
//     cityCode: '130300',
//     cityCodeName: '130300',
//     countyCode: '130303',
//     countyCodeName: '130303',
//     sex: 1,
//     nationType: '100113011004',
//     nationTypeName: '100113011004',
//     politicalType: '100113171001',
//     politicalTypeName: '100113171001',
//     cardType: '100130041001',
//     cardTypeName: '100130041001',
//     cardNum: '411527854452456',
//     educateLevel: '100113181000',
//     educateLevelName: '100113181000',
//     companyName: '北京智网科技',
//     deptName: '产品研发部',
//     positionName: '产品研发',
//     emailNum: '15874848@qq.com',
//     qqNum: '15484848',
//     wechatNum: 'wx157255',
//     birthday: '2023-06-07 00:00:00',
//     profileInfo: null,
//     hobby: null,
//     addressInfo: null,
//     createType: 0,
//     createTime: '2023-06-18 19:23:50',
//     createTimeStart: null,
//     createTimeEnd: null,
//     createrID: '4c53ed5a-8589-4e92-a26b-5d003c8cc740',
//     createrName: '4c53ed5a-8589-4e92-a26b-5d003c8cc740',
//     createPositionID: '100000000000',
//     createPositionName: '100000000000',
//     createDepartmentID: '1000000000000000',
//     createDepartmentName: '1000000000000000',
//     createCompanyID: '1000000000000000',
//     createCompanyName: '1000000000000000',
//     ownTime: '2023-06-18 19:23:50',
//     ownerID: '4c53ed5a-8589-4e92-a26b-5d003c8cc740',
//     ownerName: '4c53ed5a-8589-4e92-a26b-5d003c8cc740',
//     ownPositionID: '100000000000',
//     ownPositionName: '100000000000',
//     ownDepartmentID: '1000000000000000',
//     ownDepartmentIName: null,
//     ownCompanyID: '1000000000000000',
//     ownCompanyName: '1000000000000000',
//     modifyTime: '2023-06-20 15:38:49',
//     modifyerID: '4c53ed5a-8589-4e92-a26b-5d003c8cc740',
//     modifyerName: '4c53ed5a-8589-4e92-a26b-5d003c8cc740',
//     modifyPositionID: '100000000000',
//     modifyPositionName: '100000000000',
//     modifyDepartmentID: '1000000000000000',
//     modifyDepartmentName: '1000000000000000',
//     modifyCompanyID: '1000000000000000',
//     modifyCompanyName: '1000000000000000',
//     extField: null,
//     versionNum: 7,
//     remark: null,
//     msupplierInfo: null,
//   },
//   {
//     page: 0,
//     rows: 0,
//     sort: null,
//     order: null,
//     dicTypeIds: null,
//     orderNum: null,
//     orderType: null,
//     orderTypeName: null,
//     errorMessage: null,
//     paramObject: null,
//     currentUserID: null,
//     versionFlag: true,
//     tenantID: null,
//     tenantName: null,
//     id: '8358732881207578625',
//     supplierID: '8358379213307867137',
//     supplierName: '中国科盛科技智能有限公司',
//     fullName: '张宇强',
//     phoneNum: null,
//     phoneMobile: '17596912111',
//     phoneOffice: '15151515',
//     phoneSpare: '18348569874',
//     isFirst: 0,
//     provinceCode: '130000',
//     provinceCodeName: '130000',
//     cityCode: '130300',
//     cityCodeName: '130300',
//     countyCode: '130303',
//     countyCodeName: '130303',
//     sex: 2,
//     nationType: '100113011004',
//     nationTypeName: '100113011004',
//     politicalType: '100113171001',
//     politicalTypeName: '100113171001',
//     cardType: '100130041001',
//     cardTypeName: '100130041001',
//     cardNum: '411527854452456',
//     educateLevel: '100113181000',
//     educateLevelName: '100113181000',
//     companyName: '北京智网科技',
//     deptName: '产品研发部',
//     positionName: '产品研发',
//     emailNum: '15874848@qq.com',
//     qqNum: '15484848',
//     wechatNum: 'wx157255',
//     birthday: '2023-06-07 00:00:00',
//     profileInfo: null,
//     hobby: null,
//     addressInfo: null,
//     createType: 0,
//     createTime: '2023-06-18 19:23:50',
//     createTimeStart: null,
//     createTimeEnd: null,
//     createrID: '4c53ed5a-8589-4e92-a26b-5d003c8cc740',
//     createrName: '4c53ed5a-8589-4e92-a26b-5d003c8cc740',
//     createPositionID: '100000000000',
//     createPositionName: '100000000000',
//     createDepartmentID: '1000000000000000',
//     createDepartmentName: '1000000000000000',
//     createCompanyID: '1000000000000000',
//     createCompanyName: '1000000000000000',
//     ownTime: '2023-06-18 19:23:50',
//     ownerID: '4c53ed5a-8589-4e92-a26b-5d003c8cc740',
//     ownerName: '4c53ed5a-8589-4e92-a26b-5d003c8cc740',
//     ownPositionID: '100000000000',
//     ownPositionName: '100000000000',
//     ownDepartmentID: '1000000000000000',
//     ownDepartmentIName: null,
//     ownCompanyID: '1000000000000000',
//     ownCompanyName: '1000000000000000',
//     modifyTime: '2023-06-20 15:38:49',
//     modifyerID: '4c53ed5a-8589-4e92-a26b-5d003c8cc740',
//     modifyerName: '4c53ed5a-8589-4e92-a26b-5d003c8cc740',
//     modifyPositionID: '100000000000',
//     modifyPositionName: '100000000000',
//     modifyDepartmentID: '1000000000000000',
//     modifyDepartmentName: '1000000000000000',
//     modifyCompanyID: '1000000000000000',
//     modifyCompanyName: '1000000000000000',
//     extField: null,
//     versionNum: 7,
//     remark: null,
//     msupplierInfo: null,
//   },
// ];

const ManageView: React.FC<ContacterAPI.IManageView> = ({ curRes }) => {
  const contacterManageRef: any = React.useRef();

  const { contacterTableData, data, loading, pagination, searchList, refreshManage } = contacterManageService(curRes);

  useEffect(() => {
    contacterTableData({});
  }, [curRes]);

  /**保存 点击编辑 的行数据*/
  const [updateRowObj, setUpdateRowObj] = useState<any>({});

  /**打开关闭新增编辑弹框*/
  const [updateModal, setUpdateModal] = useState<boolean>(false);

  /** 是否打开详情抽屉 */
  const [showDetailDrawer, setShowDetailDrawer] = useState<boolean>(false);
  const chanageDetailDrawer = (isShow: boolean) => {
    setShowDetailDrawer(isShow);
  };

  /** 是否打开归属客户 */
  // const [showIsOwenModal, setShowIsOwenModal] = useState<boolean>(false);

  /**  重置搜索表单方法 */
  const onReset = (values: any) => {
    contacterTableData({ ...values });
  };

  /** 搜索列表 */
  const onSearch = (request: ContacterAPI.IGridRequestType) => {
    contacterTableData({ ...request });
  };

  /**
   * 表格操作的回调
   * @param res 接口返回
   */
  const tableCallback = (res: any) => {
    if (res && res?.msgFlag) {
      message.success(res?.msg);
      refreshManage();
    } else {
      message.error(res?.msg);
    }
  };

  /**引入删除*/
  const { deleteContacterLoading, deleteContacterRun } = deleteContacterService(tableCallback);

  /** 分页change 方法*/
  const onPageChange = (current: any, pageSize: any, params: any) => {
    contacterTableData({
      pageSize,
      current,
      ...params,
    });
  };

  /**
   * 表格操作按钮点击方法
   */
  const onOptClick: ContacterAPI.IOperationClick = {
    onEdit: (resObj) => {
      setUpdateRowObj({ ...resObj, modalType: 'edit' });
      setUpdateModal(true);
    },
    onView: (resObj) => {
      setUpdateRowObj(resObj);
      chanageDetailDrawer(true);
    },
    onDelete: (resObj) => {
      let deletePayload: any = {
        id: resObj?.id,
      };
      deleteContacterRun(deletePayload);
    },
    onIsOwen: (resObj) => {
      // setUpdateRowObj(resObj);
      // setShowIsOwenModal(true);
    },
  };

  /**
   * 获取columns方法
   */
  const columns: Record<string, any>[] = React.useMemo(() => {
    return getTableColumns(curRes, onOptClick);
  }, [curRes]);

  /**操作按钮列表*/
  const actionList: ContacterAPI.IActionList = React.useMemo(() => {
    return [
      {
        title: '添加',
        visible: curRes?.['/supplierContacterController/add'] || false,
        type: 'primary',
        icon: <PlusOutlined />,
        onClick: () => {
          setUpdateRowObj({});
          setUpdateModal(true);
        },
      },
    ];
  }, [curRes]);

  return (
    <div
      style={{
        position: 'relative',
        overflow: 'hidden',
        height: '100%',
        width: '100%',
      }}
    >
      <SchemaManage
        ref={contacterManageRef}
        searchProps={{
          switchList: [], //头部切换列表
          searchList, //搜索表单列表
          onReset, //重置
          onSwitch: () => {}, //头部切换
          onSearch, //搜索方法
        }}
        actionList={actionList} //Table头部操作按钮列表
        tableProps={{
          // table 表格属性
          columns: columns,
          dataSource: data?.rows,
          // dataSource: mockDataList,
          loading: loading || deleteContacterLoading,
          pagination: pagination as any,
          rowKey: 'id',
          onPageChange: onPageChange, //分页change方法
        }}
      />

      {/* 新增编辑弹框 */}
      {updateModal && (
        <UpdateModal
          curRes={curRes}
          isShowModal={updateModal}
          onClose={() => {
            setUpdateModal(false);
          }}
          checkRows={updateRowObj}
          reloadManage={refreshManage}
        />
      )}

      {/* 详情抽屉 */}
      <DetailDrawerView
        visible={showDetailDrawer}
        onCloceDrawer={() => {
          setShowDetailDrawer(false);
        }}
        checkRows={updateRowObj}
      />

      {/* 设置归属客户 */}
      {/* {showIsOwenModal && (
        <CustomerModal
          onClose={() => {
            setShowIsOwenModal(false);
          }}
          checkRows={updateRowObj}
          curRes={curRes}
          reloadManage={refreshManage}
        />
      )} */}
    </div>
  );
};

export default connect(({ baseLogin, navTab }: Record<string, any>) => ({
  curRes: baseLogin?.permissions,
  navTab,
}))(ManageView);
